import vue from "vue"
import vuex from "vuex"
vue.use(vuex)

const state = {
    // 创建一个存储购物车信息的localStorage，数据类型为
    //let carts =  {'gid':{count:1,goods:{}},gid2:{count:1,goods:{}}}
    carts: {},
    // 创建一个收藏商品信息的数据
    collections: {}
};
const mutations = {
    // 加购商品
    // 先看看localStorage有没有，有就显示出来，没有就默认创建一个null
    addCart(state, goodsfo) {
        if (localStorage.getItem("carts")) {
            state.carts = JSON.parse(localStorage.getItem("carts"))
        }
        // 详情页加购商品，先去本地拿数据，有购物车数据，并且有相同商品，那么通过id找到，并且将count++
        // 没有对应商品，那么就通过id创建商品数据。
        if (state.carts[goodsfo.id]) {
            state.carts[goodsfo.id].count++
        } else {
            state.carts[goodsfo.id] = {
                count: "1",
                goodsfo: goodsfo
            }
        }
        // 做了处理后将购物车数据存进去更新了再拿出来赋值给state的carts
        localStorage.setItem("carts", JSON.stringify(state.carts))
        console.log("购买一个" + goodsfo.name + "成功")
        state.carts = JSON.parse(localStorage.getItem("carts"))
    },

    addOrCancelCollection(state, goodsfo) {
        if (localStorage.getItem("collection")) {
            state.collections = JSON.parse(localStorage.getItem("collection"))
        }
        // 如果在收藏中通过id找到商品已收藏，那么将收藏状态改为0；
        if (state.collections[goodsfo.id]) {
            if (state.collections[goodsfo.id].collectState == "1") {
                delete state.collections[goodsfo.id]
                console.log("取消收藏" + goodsfo.name + "成功")
            }

        } else {
            // 收藏中没有这件商品，那么创建数据
            state.collections[goodsfo.id] = {
                collectState: "1",
                goodsfo: goodsfo

            }
            console.log("收藏" + goodsfo.name + "成功")
        }
        //将数据存进localStorage
        localStorage.setItem("collections", JSON.stringify(state.collections))
        // 然后在更新state仓库的数据
        state.collections = JSON.parse(localStorage.getItem("collections"))
    },
    // 展示收藏商品信息
    showCollection(state) {
        state.collections = JSON.parse(localStorage.getItem("collections"))
    },
    // 用户直接进入购物车页面。那么需要展示购物车的信息
    showCart(state) {
        state.carts = JSON.parse(localStorage.getItem("carts"))
    },
    // 用户操作了购物车信息需要将最新数据存入localStorage
    updateStorage(state) {
        localStorage.setItem("carts", JSON.stringify(state.carts))
    }

    // 

}
const actions = {
    // addCart的异步提交方法
    asynAddCart(context, goodsfo) {
        context.commit('addCart', goodsfo)
    },
    asynAddOrCancelCollection(context, goodsfo) {
        context.commit("addOrCancelCollection", goodsfo)
    },
    asynshowCollection(context){
        context.commit("showCollection")
    },
    // showCart的异步提交方法
    asynShowCart(context) {
        context.commit('showCart')
    },
    // updateStorage的异步提交方法
    asynUpdateStorage(context) {
        context.commit("updateStorage")
    }
}
const store = new vuex.Store({
    state,
    mutations,
    actions
})
export default store;